<template>
  <a-modal
    width="600px"
    :footer="null"
    :maskClosable="false"
    :closable="false"
    :mask="false"
    v-model:open="modalShow"
    :wrap-style="{ overflow: 'hidden' }"
  >
    <template #title>
      <modalTitle @close="close" title="重点建议"></modalTitle>
    </template>
    <div class="conten">
      <div style="overflow-y: auto; scrollbar-width: none; -ms-overflow-style: none; height: 100%">
        <div class="tiBox flex" v-for="(item, index) in list" :key="index">
          <img src="../../../../../public/img/info/lengxing.png" alt="" class="img" />
          <div class="flex_1">
            <div style="font-size: 14px; margin-bottom: 6px">{{ item.neirong }}</div>
            <div style="font-size: 12px; color: rgba(255, 255, 255, 0.6)">{{ item.createtime }}</div>
          </div>
        </div>
      </div>
    </div>
  </a-modal>
</template>
<script setup>
import { reactive, ref } from "vue"
import modalTitle from "../modalTitle.vue"
import $api from "@/utils/request.js"

const list = ref([])
const modalShow = ref(false)

const emit = defineEmits(["xfrw", "close", "success"])

// spi/index/getZdjy    重點建議

const close = () => {
  modalShow.value = false
  emit("close")
}

const show = async (e) => {
  const res = await $api.get("api/V1/getZdjy", { page: 1, pagesize: 1000 })
  list.value = res.data.data
  console.log("重點列表", res)
  modalShow.value = true
}
defineExpose({ show, close })
</script>
<style scoped lang="less">
.conten {
  color: #fff;
  padding: 0px 20px 20px;
  height: 500px;

  .tiBox {
    border-radius: 10px;
    padding: 10px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    margin-bottom: 14px;
    &:last-child {
      margin-bottom: 0;
    }
    .img {
      width: 12px;
      height: 16px;
      margin-right: 6px;
    }
  }
}
.flex {
  display: flex;
}
.flex_1 {
  flex: 1;
}
</style>
